<template>
  <view
    v-for="(rule, index) in ruleList"
    :key="index"
    class="item"
    @click="normInfo(rule)"
  >
    <image
      :src="
        rule.url
          ? base64ToBlobUrl(rule?.url)
          : 'https://bpic.588ku.com/templet_pic/21/01/29/4dc36ffdecd4142798c07239195a2954.jpg'
      "
      class="img"
      mode="widthFix"
    />
    <view class="desc">
      {{ rule?.desc }}
    </view>
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { normList } from '@/api/home'
import { base64ToBlobUrl } from '@/common/img'

const ruleList = ref<any>([])

const normInfo = (rule: any) => {
  uni.navigateTo({
    url: '/pages/others/normInfo?id=' + rule.id
  })
}

onLoad(async (option: any) => {
  const pageId = option?.id
  if (pageId !== '1') {
    uni.setNavigationBarTitle({
      title: '业委公告'
    })
  }
  uni.setStorageSync('pageId', option.id)
  const res = await normList(pageId)
  ruleList.value = res?.data
})
</script>

<style scoped lang="scss">
.item {
  width: 95%;
  height: auto;
  margin: 0 auto;
  padding: 10px 0;
  display: flex;
  align-items: center;
  // 设置边框阴影
  box-shadow: 1px 1px 2px #ccc;
  // 下边框阴影
  border-radius: 10rpx;
  margin-top: 20rpx;
  .img {
    width: 40%;
    border-radius: 5px;
    margin-left: 10rpx;
  }
  .desc {
    width: 60%;
    margin-right: 10rpx;
    font-size: 30rpx;
    text-align: justify;
    padding: 0 10rpx;
  }
}
</style>
